
<div class="layui-card">
    <div class="layui-card-header">
        <h2 class="header-title">菜单管理</h2>
        <span class="layui-breadcrumb pull-right">
          <a href="#!console">首页</a>
          <a><cite>菜单管理</cite></a>
        </span>
    </div>
    <div class="layui-card-body">
        <div class="layui-form toolbar">
            	搜索：
            <select id="user-search-key">
                <option value="">-请选择-</option>
                <option value="user_id">ID</option>
                <option value="username">账号</option>
                <option value="nick_name">用户名</option>
                <option value="phone">手机号</option>
            </select>&emsp;
            <input id="user-search-value" class="layui-input search-input" type="text" placeholder="输入关键字"/>&emsp;
            <div class="layui-inline">
                <button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon"></i>搜索</button>
                <button id="btnAdd" class="layui-btn icon-btn"><i class="layui-icon"></i>添加</button>
                <button id="btnExpand" class="layui-btn icon-btn">全部展开</button>
                <button id="btnFold" class="layui-btn icon-btn">全部折叠</button>
            </div>
            <!--<button id="user-btn-search" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
            <button id="user-btn-add" class="layui-btn icon-btn"><i class="layui-icon">&#xe654;</i>重置</button>-->
        </div>
		<div style="height: 100%">
		    <div class="dHead">
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="window.location.href='index.html';">刷新</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="reload()">reload</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="query()">query</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="add(null);">新增一行</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="openorclose();">隐藏或打开香蕉节点</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="getCheckData();">获取选中行数据</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="getCheckLength();">获取选中数目</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="print();">打印缓存对象</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="openAll();">展开或折叠全部</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="radioStatus();">获取单选数据</a>
		        <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-xstree"  onclick="test();">test</a>
		        <br>
		        <br>
		       <!--<img src="img/1_open.png" onerror="src='img/1_close.png'" alt="">-->
		    </div>
		    <div class="dBody">
		        <table class="layui-hidden" id="treeTable" lay-filter="treeTable"></table>
		    </div>
		</div>

    </div>
</div>
<!-- 表格操作列 -->
<script type="text/html" id="tableBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<!-- 表单弹窗 -->


<!-- js部分 -->
<script>
  

        // 渲染表格
       
//		table.render({
//          elem: '#authTable',
//          url: config.base_server + 'menu.json',
//          where: {
//              access_token: config.getToken().access_token
//          },
//          page: false,
//          cols: [[
//               	{type: 'numbers'},
//                  {field: 'authorityName', title: '权限名称', minWidth: 200},
//                  {field: 'menuUrl', title: '菜单url'},
//                  {field: 'authority', title: '权限标识'},
//                  {field: 'orderNumber', title: '排序号', align: 'center'},
//                  {
//                      title: '类型', templet: function (d) {
//                          var strs = ['<span class="layui-badge-rim">菜单</span>', '<span class="layui-badge layui-bg-gray">按钮</span>'];
//                          return strs[d.isMenu];
//                      }, align: 'center'
//                  },
//                  {templet: '#tableBar', title: '操作', align: 'center', minWidth: 120}
//          ]]
//      });
 layui.use(['form', 'table', 'util', 'config', 'admin', 'formSelects','authtree', 'layer','treeGrid'], function () {
        var form = layui.form;
        var table = layui.table;
        var config = layui.config;
        var layer = layui.layer;
        var util = layui.util;
        var admin = layui.admin;
        var formSelects = layui.formSelects;
        var authtree = layui.authtree; 
       

	var editObj=null,ptable=null,treeGrid=null,tableId='treeTable',layer=null;
	 var treeGrid = layui.treeGrid;//很重要
        treeGrid.render({
            id:tableId
            ,elem: '#'+tableId
            ,url:'http://127.0.0.1/json/treeData.json'
            ,cellMinWidth: 100
            ,idField:'id'//必須字段
            ,treeId:'id'//树形id字段名称
            ,treeUpId:'pId'//树形父id字段名称
            ,treeShowName:'name'//以树形式显示的字段
            ,heightRemove:[".dHead",10]//不计算的高度,表格设定的是固定高度，此项不生效
            ,height:'100%'
            ,isFilter:false
            ,iconOpen:true//是否显示图标【默认显示】
            ,isOpenDefault:true//节点默认是展开还是折叠【默认展开】
            ,loading:true
            ,method:'get'
            ,isPage:false
            ,cols: [[
                 {type:'numbers'}
                ,{type:'checkbox',sort:true}
                ,{type:'radio'}
                ,{field:'name', width:300, title: '水果名称',edit:'text',sort:true}
                ,{field:'id',width:100, title: 'id',sort:true}
                ,{field:'pId', title: 'pid',sort:true}
                ,{width:100,title: '操作', align:'center'/*toolbar: '#barDemo'*/
                    ,templet: function(d){
                        var html='';
                        var addBtn='<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="add">添加</a>';
                        var delBtn='<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>';
                        return addBtn+delBtn;
                    }
                }
            ]]
            ,parseData:function (res) {//数据加载后回调
                return res;
            }
            ,onClickRow:function (index, o) {
                console.log(index,o,"单击！");
                //msg("单击！,按F12，在控制台查看详细参数！");
            }
            ,onDblClickRow:function (index, o) {
                console.log(index,o,"双击");
                msg("双击！,按F12，在控制台查看详细参数！");
            }
            ,onCheck:function (obj,checked,isAll) {//复选事件
                console.log(obj,checked,isAll,"复选");
                msg("复选,按F12，在控制台查看详细参数！");
            }
            ,onRadio:function (obj) {//单选事件
                console.log(obj,"单选");
                msg("单选,按F12，在控制台查看详细参数！");
            }
        });

        treeGrid.on('tool('+tableId+')',function (obj) {
            if(obj.event === 'del'){//删除行
                del(obj);
            }else if(obj.event==="add"){//添加行
                add(obj);
            }
        });
    });
</script>
